<!doctype html>
<html lang="en">

<head>
    <meta charset="utf-8" />
    <title>档口脚标机发放记录信息</title>
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />

    <!-- App favicon -->
    <link rel="shortcut icon" href="assets/images/favicon.ico">

    <!-- App css -->
    <link href="assets/css/bootstrap.min.css" rel="stylesheet" type="text/css" />
    <!-- layui日期插件样式 -->
    <link rel="stylesheet" type="text/css" href="plugins/layui2/css/layui.css" />
    <link href="assets/css/icons.css" rel="stylesheet" type="text/css" />
    <link href="assets/css/metismenu.min.css" rel="stylesheet" type="text/css" />
    <link href="assets/css/style.css" rel="stylesheet" type="text/css" />
    <link rel="stylesheet" type="text/css" href="assets/css/custom.css" />
    <!-- layer插件 -->
    <link rel="stylesheet" type="text/css" href="plugins/layer2.4/skin/layer.css" />

    <!-- bootstrap-select -->
    <link rel="stylesheet" type="text/css" href="plugins/bootstrap-select/css/bootstrap-select.min.css" />
    <script src="assets/js/modernizr.min.js"></script>

</head>

<body>

    <!-- Begin page -->
    <div id="wrapper">

        <!-- ============================================================== -->
        <!-- 页面内容开始 -->
        <!-- ============================================================== -->

        <!-- Start Page content -->
        <div class="my-content">
            <div class="container-fluid">
                <div class="row">
                    <div class="col-md-12">
                        <div class="card-box">
                            <h4 class="m-t-0 m-b-30 header-title">脚标机发放记录信息</h4>

                            <form class="form-horizontal" role="form">
                                <div class="form-group row">
                                    <label for="slaughterHouseName" class="col-3 col-form-label">发放市场</label>
                                    <div class="col-9">
                                        <select class="selectpicker form-control" id="slaughterHouseName"
                                            name="slaughterHouseName" title="发放市场" data-live-search="true"
                                            data-hide-disabled="ture" data-actions-box="true">
                                        </select>
                                    </div>
                                </div>
                                <div class="form-group row">
                                    <label for="barcodeMachine" class="col-3 col-form-label">脚标机编号</label>
                                    <div class="col-9">
                                        <select class="selectpicker form-control" id="barcodeMachine"
                                            name="barcodeMachine" title="脚标机编号" data-live-search="true"
                                            data-hide-disabled="ture" data-actions-box="true">
                                        </select>
                                    </div>
                                </div>
                                <div class="form-group row">
                                    <label for="stallsId" class="col-3 col-form-label">发放档口</label>
                                    <div class="col-9">
                                        <select class="selectpicker form-control" id="stallsId" name="stallsId"
                                            title="发放档口" data-live-search="true" data-hide-disabled="ture"
                                            data-actions-box="true">
                                        </select>
                                    </div>
                                </div>
                                <div class="form-group row">
                                    <label for="grantDate" class="col-3 col-form-label">发放时间</label>
                                    <div class="col-9">
                                        <input type="text" class="form-control layui-input" id="grantDate"
                                            name="grantDate" placeholder="发放时间" >
                                    </div>
                                </div>
                                <div class="form-group row">
                                    <label for="grantPersonId" class="col-3 col-form-label">发放人员</label>
                                    <div class="col-9">
                                        <input type="text" class="form-control" id="grantPersonId"
                                            name="grantPersonId" value="1a65dd22c3d04020ab61dbc3e08bacac" disabled>
                                        <!-- <select class="selectpicker form-control" id="grantPersonId"
                                            name="grantPersonId" title="发放人员" data-live-search="true"
                                            data-hide-disabled="ture" data-actions-box="true">
                                        </select> -->
                                    </div>
                                </div>
                                <div class="form-group row">
                                    <label for="receivePersonId" class="col-3 col-form-label">领取人员</label>
                                    <div class="col-9">
                                        <input type="text" class="form-control" id="receivePersonId"
                                            name="receivePersonId" value="" placeholder="领取人员" disabled>
                                        <!-- <select class="selectpicker form-control" id="receivePersonId"
                                            name="receivePersonId" title="领取人员" data-live-search="true"
                                            data-hide-disabled="ture" data-actions-box="true">
                                        </select> -->
                                    </div>
                                </div>
                                <div class="form-group row">
                                    <label for="status" class="col-3 col-form-label">状态</label>
                                    <div class="col-9">
                                        <select class="selectpicker form-control" id="status" name="status" title="状态"
                                            data-hide-disabled="ture" data-actions-box="true">
                                            <option value="0">销售</option>
                                            <option value="1">租用</option>
                                        </select>
                                    </div>
                                </div>
                                <div class="form-group row">
                                    <label for="deposit" class="col-3 col-form-label">押金（元）</label>
                                    <div class="col-9">
                                        <input type="text" class="form-control" id="deposit" name="deposit"
                                            placeholder="押金">
                                    </div>
                                </div>
                                <div class="form-group row">
                                    <label for="agreementNumber" class="col-3 col-form-label">纸质协议编号</label>
                                    <div class="col-9">
                                        <input type="text" class="form-control" id="agreementNumber"
                                            name="agreementNumber" placeholder="纸质协议编号">
                                    </div>
                                </div>
                                <div class="form-group mb-0 justify-content-end row">
                                    <div class="col-9">
                                        <button type="submit" class="btn btn-primary waves-effect" >提交</button>
                                        <button type="button" onclick="layer_close()"
                                            class="btn btn-danger waves-effect">
                                            关闭
                                        </button>
                                    </div>
                                </div>
                            </form>
                        </div>
                    </div>
                </div>

            </div>
            <!-- container -->

        </div>

        <!-- ============================================================== -->
        <!-- End Right content here -->
        <!-- ============================================================== -->

    </div>
    <!-- END wrapper -->

    <!-- jQuery  -->
    <script src="assets/js/jquery.min.js"></script>
    <script src="assets/js/bootstrap.bundle.min.js"></script>
    <script src="assets/js/metisMenu.min.js"></script>
    <script src="assets/js/waves.js"></script>
    <script src="assets/js/jquery.slimscroll.js"></script>

    <!-- App js -->
    <script src="assets/js/custom.js" type="text/javascript" charset="utf-8"></script>
    <script src="assets/js/jquery.core.js"></script>
    <script src="assets/js/jquery.app.js"></script>
    <script src="assets/js/custom.js" type="text/javascript" charset="utf-8"></script>

    <!-- 表单验证 -->
    <script src="plugins/jquery.form.js/jquery.form.min.js" type="text/javascript" charset="utf-8"></script>
    <script src="plugins/jquery.validation.1.14.0/jquery.validate.js" type="text/javascript" charset="utf-8"></script>
    <script src="plugins/jquery.validation.1.14.0/validate-methods.js" type="text/javascript" charset="utf-8"></script>
    <script src="plugins/jquery.validation.1.14.0/messages_zh.js" type="text/javascript" charset="utf-8"></script>
    <!-- bootstrap-select -->
    <script src="plugins/bootstrap-select/js/bootstrap-select.js" type="text/javascript" charset="utf-8"></script>

    <!-- layer插件 -->
    <script src="plugins/layer2.4/layer.js" type="text/javascript" charset="utf-8"></script>
    <!-- layui的日期插件 -->
    <script src="plugins/layui2/layui.js" type="text/javascript" charset="utf-8"></script>
    <script type="text/javascript">
        layui.use('laydate', function () {
            var laydate = layui.laydate;

            //执行一个laydate实例
            laydate.render({
                elem: '#grantDate' //指定元素
            });
        });
        $(function () {
            // grantDate

            //获得市场列表
            $.ajax({
                type: "get",
                url: URL + 'slaughterHouse',
                async: false,
                dataType: "json",
                success: function (data) {
                    data = data.object
                    for (var i = 0; i < data.length; i++) {
                        var options = $('<option value="' + data[i].id + '">' + data[i].name +
                            '</option>')
                        $("#slaughterHouseName").append(options);
                    }
                    $('.selectpicker').selectpicker('refresh');
                    $('.selectpicker').selectpicker('render');
                },
                error: function (XMLHttpRequest, textStatus, errorThrown) {
                    networkError(XMLHttpRequest, textStatus, errorThrown)
                }
            });
            // 监听市场选择框事件
            $("#slaughterHouseName").change(function () {
                var slaughterHouseId = $("#slaughterHouseName").val()
                // console.log(slaughterHouseId);
                // 先清空脚标机和档口选择框数据
                $("#barcodeMachine").html("")
                $("#stallsId").html("")
                //获得脚标机列表
                $.ajax({
                    type: "get",
                    url: URL + 'houseMachine/findUnGrantByHouseId/' + slaughterHouseId,
                    async: false,
                    dataType: "json",
                    success: function (data) {
                        data = data.object
                        for (var i = 0; i < data.length; i++) {
                            var options = $('<option value="' + data[i].id + '">' + data[i]
                                .barcodeMachineNumber + '</option>')
                            $("#barcodeMachine").append(options);
                        }
                        $('.selectpicker').selectpicker('refresh');
                        $('.selectpicker').selectpicker('render');
                    },
                    error: function (XMLHttpRequest, textStatus, errorThrown) {
                        networkError(XMLHttpRequest, textStatus, errorThrown)
                    }
                });
                //获得档口列表
                $.ajax({
                    type: "get",
                    url: URL + 'stalls/findByHouseId?houseId=' + slaughterHouseId,
                    async: false,
                    dataType: "json",
                    success: function (data) {
                        data = data.object
                        // console.log(data)
                        for (var i = 0; i < data.length; i++) {
                            var options = $(`<option value="${data[i].id} ">${data[i].stallsName}[ id=${data[i].id}]</option>`)
                            $("#stallsId").append(options);
                        }
                        $('.selectpicker').selectpicker('refresh');
                        $('.selectpicker').selectpicker('render');
                    },
                    error: function (XMLHttpRequest, textStatus, errorThrown) {
                        networkError(XMLHttpRequest, textStatus, errorThrown)
                    }
                });
            })

            // 监听档口改变事件
            $("#stallsId").change(function () {
                var slaughterHouseId = $("#slaughterHouseName").val()
                var length = $("[aria-selected=true]").length
                if (length == 4) {
                    length = 3;
                }
                // 获取所选择档口的序号
                var index = $($($("[aria-selected=true]")[length - 1]).parent()[0]).attr('data-original-index')
                $.ajax({
                    type: "get",
                    url: URL + 'stalls/findByHouseId?houseId=' + slaughterHouseId,
                    async: false,
                    dataType: "json",
                    success: function (data) {
                        data = data.object
                        // console.log(data)
                        // console.log(index)
                        $('#receivePersonId').val(data[index - 1].userId)
                    },
                    error: function (XMLHttpRequest, textStatus, errorThrown) {
                        networkError(XMLHttpRequest, textStatus, errorThrown)
                    }
                });
            })

            //获取用户列表
            $.ajax({
                type: "post",
                url: URL + 'findUserAll',
                async: false,
                dataType: "json",
                success: function (data) {
                    for (var i = 0; i < data.length; i++) {
                        var options = $('<option value="' + data[i].personId + '">' + data[i]
                            .username + '    [id=' + data[i].personId + ']' + '</option>')
                        $("#grantPersonId").append(options);
                    }
                    $('.selectpicker').selectpicker('refresh');
                    $('.selectpicker').selectpicker('render');
                },
                error: function (XMLHttpRequest, textStatus, errorThrown) {
                    networkError(XMLHttpRequest, textStatus, errorThrown)
                }
            });
            //获取用户列表
            $.ajax({
                type: "post",
                url: URL + 'findUserAll',
                async: false,
                dataType: "json",
                success: function (data) {
                    for (var i = 0; i < data.length; i++) {
                        var options = $('<option value="' + data[i].personId + '">' + data[i]
                            .username + '    [id=' + data[i].personId + ']' + '</option>')
                        $("#receivePersonId").append(options);
                    }
                    $('.selectpicker').selectpicker('refresh');
                    $('.selectpicker').selectpicker('render');
                },
                error: function (XMLHttpRequest, textStatus, errorThrown) {
                    networkError(XMLHttpRequest, textStatus, errorThrown)
                }
            });


            //表单验证
            $('form').validate({
                rules: {
                    slaughterHouseName: {
                        required: true
                    },
                    barcodeMachine: {
                        required: true
                    },
                    stallsId: {
                        required: true,
                    },
                    grantDate: {
                        dateISO: true,
                        required: true,
                    },
                    grantPersonId: {
                        required: true,
                    },
                    receivePersonId: {
                        required: true,
                    },
                    status: {
                        required: true,
                    },
                    deposit: {
                        required: true,
                    },
                    agreementNumber: {
                        required: true,
                    },
                },
                onkeyup: false,
                focusCleanup: true,
                success: "valid",
                submitHandler: function (form) {
                    var userid = getCookie("userid");
                    console.log(userid);
                    var index = parent.layer.getFrameIndex(window.name);
                    //处理脚标机的id和number
                    var barcodeMachineSelect = document.getElementById("barcodeMachine");
                    var index = barcodeMachineSelect.selectedIndex;
                    var barcodeMachine = barcodeMachineSelect.options[index].text;
                    // var Id = barcodeMachine.slice(barcodeMachine.indexOf("["), -1);
                    // Id = Id.slice(4);
                    // var Number = barcodeMachine.slice(0, barcodeMachine.indexOf("["));
                    // console.log(barcodeMachine)
                    // Number = Number.slice(0, -1);
                    $(form).ajaxSubmit({
                        type: "POST",
                        url: URL + "barcodeMachineGrant",
                        data: {
                            // "createBy": userid,
                            "grantPersonId":$('#grantPersonId').val(),
                            "receivePersonId":$('#receivePersonId').val(),
                            "barcodeMachineId": barcodeMachine,
                            "barcodeMachineNumber": barcodeMachine
                        },  
                        success: function (data) {
                            parent.layer.msg('添加成功!', {
                                icon: 1,
                                time: 1000
                            });
                            setTimeout(function () {
                                parent.$(".btn-refresh").click();
                                parent.layer.closeAll();;
                            }, 1000);

                        },
                        error: function (XMLHttpRequest, textStatus, errorThrown) {
                            networkError(XMLHttpRequest, textStatus, errorThrown)
                        }
                    });
                }
            });
        });
    </script>

</body>

</html>